<template>
    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" :append-to-body="true"
        :close-on-click-modal="false">
        <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
            <el-tab-pane label="基本信息" name="baseInfo"></el-tab-pane>
            <el-tab-pane label="列信息" name="molumnInfo"></el-tab-pane>
            <el-tab-pane label="详细数据" name="detailInfo"></el-tab-pane>
        </el-tabs>
        <baseTable  ref="baseTable" v-show="activeName=='baseInfo'"   />
        <columnTable ref="columnTable"  v-show="activeName=='molumnInfo'"  />
        <detail ref="detail" v-show="activeName=='detailInfo'"  />
        <pagination v-show="total > 0" :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.limit"
            :page-sizes="pageArray" @pagination="setList" />
        <div slot="footer" class="dialog-footer">
            <!-- <el-button @click="dialogFormVisible = false">
                {{ $t('table.cancel') }}
            </el-button>
            <el-button type="primary" :loading="loading" @click="dialogStatus === 'create' ? createData() : updateData()">
                {{ $t('table.confirm') }}
            </el-button> -->
        </div>


    </el-dialog>
</template>

<script>
import { getSourceList, getTableList } from '@/api/masterdata/masterdataTable'
import {getMasterdataTable } from '@/api/masterdata/masterdataTable'
import { getDetail } from '@/api/masterdata/detailTable'
import Pagination from '@/components/Pagination'
import baseTable from './baseTable.vue'
import columnTable from './columnTable.vue'
import detail from './detail.vue'
export default {
    name: 'checkDetail',
    components: { Pagination,columnTable,detail,baseTable },
    data() {
        return {
            listQuery: {
                tableId: undefined,
                page: 1,
                limit: this.$store.getters.defaultPageSize
            },
            rules:{},
            total: 0,
            pageArray: this.$store.getters.pageArray,
            textMap: {
                update: '编辑',
                create: '查看'
            },
            rules: {},
            loading: false,
            dialogFormVisible: false,
            dialogStatus: '',
            tableData: [],
            sourceData: [],
            activeName: ''
        }
    },
     created(){


     },
    methods: {
        setList(){

        },
        resTemp() {
            this.temp = {
            }
        },
        handleCreate(id) {
            this.resTemp()
            this.activeName='baseInfo'
            this.listQuery.tableId = id
            this.dialogStatus = 'create'
            setTimeout(() => {
                this.handleClick()
            });

            this.dialogFormVisible = true
        },
        //切换tab
        handleClick(e) {
            // console.log(e.index, this.activeName)
          if(this.activeName=='baseInfo'){
            this.$refs.baseTable.getList(this.listQuery.tableId)
          }else if(this.activeName=='molumnInfo'){
            this.$refs.columnTable.getList(this.listQuery)
          }else{
            this.$refs.detail.getList(this.listQuery)
          }

        },
        createData() {
            this.dialogFormVisible = false
        },
        handleUpdate() {
            this.dialogStatus = 'update'
            this.dialogFormVisible = true
        },
        updateData() {
            this.dialogFormVisible = false

        }
    }
}
</script>
<style>
.el-dialog {
    width: 70%;
}
</style>

